<template>
 <div class="dialog-box">
    <div id="mask-layer">
       <div class="dialog-child">
            <header>
               <slot name="header">

               </slot>
            </header>

            <main>
               <slot name="main">

               </slot>

            </main>
            <footer>
                <slot name="footer"></slot>

            </footer>

        </div>

    </div>
  </div>
</template>

<script>

  import NProgress from 'nprogress'
  import req from '../util/request.js'
  export default {

    data() {
      return {
        mask:null
      };
    },
    created(){

    },
    mounted(){
      this.mask=document.querySelector("#mask-layer");
      var $mask=this.mask,_wh=window.innerHeight,
      _dh=document.body.clientHeight;
      $mask.style.height=Math.max(_wh,_dh)+"px";


    },
    methods: {


      }
    }
  }
</script>

<style scoped>
    #mask-layer{
      position:absolute;
      width:100%;
      background:rgba(0,0,0,.5);
      z-index:10;
    }
</style>
